<%@page language="java" pageEncoding="UTF-8"%>
<%@page contentType="text/html; charset=utf-8"%>
<%@page import="com.mysql.jdbc.Driver"%>
<%@page import="java.sql.*"%>
<%
request.setCharacterEncoding("UTF-8");

String userName="root";
String userPassword="";
String dbName="a0713225307";

try{
	Class.forName("com.mysql.jdbc.Driver").newInstance();
	String u="jdbc:mysql://localhost/"+dbName+"?user="+userName+"&password="+userPassword+"&useUnicode=true&characterEncoding=UTF-8";
	
	java.sql.Connection connection=java.sql.DriverManager.getConnection(u,userName,userPassword);
String sql="select * from mywork_db order by pId desc";
	Statement statement=connection.createStatement();
	ResultSet rs=statement.executeQuery(sql);
	
	

%>
<div style="height:600px;width:100%;">

<table id="content-table2" class="table table-striped">
<tr style="width:100%;">
<th class="col-md-1">id</th>
<th class="col-md-2">手工名称</th>
<th class="col-md-2">分类</th>
<th class="col-md-6">描述</th>
<th class="col-md-1"></th>
</tr>
<tbody id="tb2" style="width:100%;">
<%
while(rs.next()){

%>	
<tr class="tr2">
<td class="col-md-1">
<%
out.print(rs.getString(1));
%>
</td>
<td class="col-md-2">
<%
out.print(rs.getString(2));
%>
</td>
<td class="col-md-2">
<%
out.print(rs.getString(3));
%>
</td>
<td class="col-md-6">
<div style="width:250px;height:28px;line-height:25px;overflow:hidden;">
<%
out.print(rs.getString(5));
%>
</div>
</td>
<td class="col-md-1" style="text-align:right;vertical-align:middle;">
<img src="../images/delete.png" style="width:20px;height:20px;visibility:hidden;"onclick="deleteMyWork(event);" />
</td>
</tr>
<%
}
%>	

</tbody>
</table>
</div>

<div id="page_nav3">
<span id="spanFirst2">第一页</span>
		<span id="spanPre2">上一页</span>
		<span id="spanNext2"><a href="javascript:next3();">下一页</a></span>
		<span id="spanLast2"><a href="javascript:last3();">最后一页</a></span>
		第
		<span id="spanPageNum2">1</span>
		页/共
		<span id="spanTotalPage2">2</span>
		页
</div>
<%
rs.close();
statement.close();
connection.close();
%>


<script>
var all_row2=$('#tb2 tr');

for(var i=12;i<all_row2.length;i++){
	
	all_row2.eq(i).css("display","none");
}


var theTable2 = document.getElementById("tb2");
var totalPage2 = document.getElementById("spanTotalPage2");
var pageNum2 = document.getElementById("spanPageNum2");

var spanPre2 = document.getElementById("spanPre2");
var spanNext2 = document.getElementById("spanNext2");
var spanFirst2 = document.getElementById("spanFirst2");
var spanLast2 = document.getElementById("spanLast2");

var numberRowsInTable2 = theTable2.rows.length;
var pageSize2 = 12;
var page2 = 1;

//下一页
function next3() {

	hideTable3();
	
	currentRow2 = pageSize2 * page2;
	maxRow2 = currentRow2 + pageSize2;
	if ( maxRow2 > numberRowsInTable2 )
	maxRow2 = numberRowsInTable2;
	for ( var i = currentRow2; i< maxRow2; i++ ) {
		theTable2.rows[i].style.display = '';
	}
		page2++;
	if ( maxRow2 == numberRowsInTable2 ){
		nextText3();
		lastText3();
	}
	showPage3();
	preLink3();
	firstLink3();
}

//上一页
function pre3() {

	hideTable3();
	
	page2--;

	currentRow2 = pageSize2 * page2;
	maxRow2 = currentRow2 - pageSize2;
	if ( currentRow2 > numberRowsInTable2 )
	currentRow2 = numberRowsInTable2;
	for ( var i = maxRow2; i< currentRow2; i++ ) {
		theTable2.rows[i].style.display = '';
	}


	if ( maxRow2 == 0 ) {
		preText3();
		firstText3();
	}
	
	showPage3();
	nextLink3();
	lastLink3();
}

//第一页
function first3() {
	hideTable3();
	page2 = 1;
	for ( var i = 0; i<pageSize2; i++ ) {
		theTable2.rows[i].style.display = '';
	}
	showPage3();

	preText3();
	nextLink3();
	lastLink3();
}

//最后一页
function last3() {
	hideTable3();
	page2 = pageCount3();
	currentRow2 = pageSize2 * (page2 - 1);
	for ( var i = currentRow2; i<numberRowsInTable2; i++ ) {
		theTable2.rows[i].style.display = '';
	}
	showPage3();
	
	preLink3();
	nextText3();
	firstLink3();
}

function hideTable3() {
	for ( var i = 0; i<numberRowsInTable2; i++ ) {
	theTable2.rows[i].style.display = 'none';
	}
}

function showPage3() {
	pageNum2.innerHTML = page2;
}

//总共页数
function pageCount3() {
	var count2 = 0;
	if ( numberRowsInTable2%pageSize2 != 0 ) count2 = 1; 
	return parseInt(numberRowsInTable2/pageSize2) + count2;
}

//显示链接
function preLink3() { spanPre2.innerHTML = "<a href='javascript:pre3();'>上一页</a>"; }
function preText3() { spanPre2.innerHTML = "上一页"; }

function nextLink3() { spanNext2.innerHTML = "<a href='javascript:next3();'>下一页</a>"; }
function nextText3() { spanNext2.innerHTML = "下一页"; }

function firstLink3() { spanFirst2.innerHTML = "<a href='javascript:first3();'>第一页</a>"; }
function firstText3() { spanFirst2.innerHTML = "第一页"; }

function lastLink3() { spanLast2.innerHTML = "<a href='javascript:last3();'>最后一页</a>"; }
function lastText3() { spanLast2.innerHTML = "最后一页"; }

//隐藏表格
function hide3() {
	for ( var i = pageSize2; i<numberRowsInTable2; i++ ) {
		theTable2.rows[i].style.display = 'none';
	}

	totalPage2.innerHTML = pageCount3();
	pageNum2.innerHTML = '1';
	
	nextLink3();
	lastLink3();
}

hide3();

var x2=$('.tr2');
	for(var k=0;k<x2.length;k++){
		x2[k].onmouseover=function(){
			$(this).attr("class", "highlight");
			 var imgc=$(this).find('img');
	 imgc.css("visibility","visible");
		}
		
		
   x2[k].onmouseout = function() {
	   $(this).removeAttr("class");
	   var imgc=$(this).find('img');
	   imgc.css("visibility","hidden");
 // $(this).attr("class", "odd"); //鼠标离开时还原之前的class值
 //  }
	}
	}

function deleteMyWork(e){
	e=e||window.event;
	e.target=e.target||e.srcElement;
	var p=$(e.target).parent().prev().prev().prev().prev().text();
	var param="mwId='"+p+"'";
	
	$.ajax({
		type:'POST',
		url:'deleteMyWork.jsp',
		data:param,
		success:function(){
			window.location.href=window.location.href;
		}
	});
}

</script>


<%	
	}catch(Exception e){
		e.printStackTrace();
		System.out.println(e);
		
	}

%>